import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
// import { DatetimePicker,Popup,Button,Tab, Tabs,Icon,Field,ActionSheet,CellGroup,Cell,Toast,Dialog,Switch,Overlay,Step,Steps } from 'vant';
// import 'vant/lib/index.css'; // 全局引入样式
// import { DatetimePicker,Popup,Button,Tab, Tabs,Icon,Field,ActionSheet,CellGroup,Cell,Toast,Dialog,Switch,Overlay,Step,Steps } from 'vant';
import { ActionSheet,CellGroup,Cell,Field,Button,Popup,DatetimePicker,Tab,Tabs,Switch } from 'vant';

import MxActionSheet from './components/MxVanInput/ActionSheet.vue'
import MxDatetimePicker from './components/MxVanInput/DatetimePicker.vue'

const app = createApp(App) // 创建实例

app.component('mx-action-sheet', MxActionSheet) // 类select选项组件
app.component('mx-datetime-picker', MxDatetimePicker) // 时间选项组件

app.use(ActionSheet).use(CellGroup).use(Cell).use(Field).use(Button).use(Popup).use(DatetimePicker).use(Tab).use(Tabs).use(Switch);
app.use(store).use(router).mount('#app')

// rem定义
// window.onload = function () {
  /*720代表设计师给的设计稿的宽度，你的设计稿是多少，就写多少;100代表换算比例，这里写100是
        为了以后好算,比如，你测量的一个宽度是100px,就可以写为1rem,以及1px=0.01rem等等*/

        // 750px  3.75rem
        // 1px 0.005rem
        // 14px 0.07rem


function getRem(pwidth: number , prem: number ) {
  const html = document.getElementsByTagName('html')[0]
  const oWidth = document.documentElement.clientWidth || document.body.clientWidth
  html.style.fontSize = (oWidth / pwidth) * prem + 'px'
}
getRem(375, 100)
// }
window.onresize = function () {
  getRem(375, 100)
}